<template>
    <div class="rester">
        <van-divider dashed :style="{ color: 'black', borderColor: '#879ac1', padding: '0 16px' ,fontSize:'37px'}">
           欢迎登录
        </van-divider>
        <!-- <mt-field label="手机号：" placeholder="输入手机号" type="number" v-model="phone"></mt-field>
        <mt-field label="密码：" placeholder="输入密码" type="password" v-model="password"></mt-field>
        <mt-button size="large" type="primary" @click="login()">登录</mt-button>
        <mt-button size="large" type="danger" @click="register()">去注册</mt-button> -->

 <van-form @submit="onSubmit">
  <van-field
    v-model="phone"
    name="用户名"
    label="用户名"
    placeholder="用户名"
    :rules="[{ required: true, message: '请填写用户名' },
    { pattern: /^1[356789]\d{9}$/,message: '手机号格式有误'}]"
  />
  <van-field
    v-model="password"
    type="password"
    name="密码"
    label="密码"
    placeholder="密码"
    :rules="[{ required: true, message: '请填写密码' }]"
  />
  <div style="margin: 16px;">
    <van-button round block type="info" native-type="submit">提交</van-button>
  </div>
  <div style="margin: 16px;">
    <van-button round block type="info" native-type="submit" @click="register()">去注册</van-button>
    <br>
    <van-button round block type="info" native-type="submit" @click="code()">验证码登录</van-button>
  </div>
</van-form>
        
    </div>
</template>
<script>
import Url from '../tools/Url'
import { Toast } from 'mint-ui';
export default {
    name:"rester",
    data(){
        return{
             phone: "",
            password:"",
        }

    },
    methods:{
        
            
            onSubmit(){
    
            var str = `phone=${this.phone}&password=${this.password}`;
            this.axios.post(Url.LOGIN_URL,str).then(res=>{
                console.log(res);
                if(res.data.code==200){
                    this.$store.commit("saveInfo",res.data.data);
                    sessionStorage.setItem("token",res.data.data.token);
                    this.$router.push("/");
                    Toast(res.data.message);

                }else{
                    Toast(res.data.message);
                }
            })
        },
         register(){
            this.$router.push("/regist");
        },
    code(){
        this.$router.push("/bycode");
    }
    }
}
</script>
<style scoped>
.rester{
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #fbfef9!important ;
}
.van-cell{
    background-color: #fbfef9!important ;
}
</style>